<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>登录界面</title>
  <link rel="stylesheet" href="./css/style.css">
  <link rel="stylesheet" href="./css/body.css">
  <!-- <script src="./js/login.js"></script> -->
</head>

<body>
  <div class="container">
    <section id="content">
      <form>
        <h1>账号登录</h1>
        </h1>
        <div>
          <i class="close">X</i>
          <input type="text" placeholder="手机号" id="username">
        </div>
        <div>
          <i class="close">X</i>
          <input type="password" placeholder="密码" id="password">
        </div>
        <div>
          <input type="submit" value="登录" class="btn btn-primary" id="js-btn-login">
          <a href="/day5/Ajax作业-素材/03-pwdBaseCode/index.html">忘记密码?</a>
          <a href="/day5/Ajax作业-素材/02-regbaseCode/reg.html">注册账号</a>
        </div>
      </form>
    </section>
  </div>
  <script src="/jquery.js"></script>
  <script src="/axios.js"></script>
  <script>


    // http://124.223.14.236:3001/api


    // $(function () {
    //   $('form').on('submit', function (e) {
    //     e.preventDefault()

    //     let nun = $('#username').val().trim()
    //     let sun = $('#password').val().trim()
    //     if (nun.length <= 0 || sun.length <= 0) return alert('请输入内容哦！')

    //     $.ajax({
    //       method: 'post',
    //       url: 'http://124.223.14.236:3001/api/user/login',
    //       data: {
    //         username: nun,
    //         password: sun
    //       },
    //       success: function (res) {
    //         console.log(res);
    //         if (!res.success) return alert("登录失败:" + res.msg);
    //         localStorage.setItem("token", res.data.token);
    //         localStorage.setItem("id", res.data.id);
    //         alert("登录成功:我已经将token存在本地存储中了哦");
    //         $('#username').val('')
    //         $('#password').val('')
    //       }
    //     }
    //     )
    //   })
    // })


    const form = document.querySelector('form')

    form.addEventListener('submit', async function (e) {
      e.preventDefault()

      let username = form.username.value
      let password = form.password.value

      if (username.length <= 0 || password.length <= 0) return alert('请输入内容哦！')

      const res = await axios.post('http://124.223.14.236:3001/api/user/login', {
        username,
        password
      })
      console.log(res);
      if (!res.success) return alert("登录错误:请重新登录！")
      localStorage.setItem("token", res.data.token);
      localStorage.setItem("id", res.data.id);
      alert("登录成功！");
    })

  </script>
</body>

</html>